<template>
    <a-modal v-model:visible="visible" draggable :on-before-ok="handleSubmit" @cancel="handleCancle"
        :mask-closable="false">
        <template #title>
            {{ dataForm.id ? '修改' : '新增' }}坐席账号
        </template>
        <div>
            <a-form ref="formRef" :model="dataForm" :rules="rules" label-align="right" auto-label-width size="small">
                <a-form-item field="username" label="用户名" validate-trigger="blur">
                    <a-input v-model="dataForm.username" placeholder="" allow-clear />
                </a-form-item>
                <a-form-item field="password" label="密码" validate-trigger="blur">
                    <a-input-password v-model="dataForm.password" placeholder="" :defaultVisibility="true"
                        allow-clear />
                </a-form-item>
                <a-form-item field="remark" label="备注信息" validate-trigger="blur">
                    <a-textarea v-model="dataForm.remark" placeholder="" allow-clear />
                </a-form-item>
            </a-form>
        </div>
    </a-modal>
</template>
<script>
import debounce from 'lodash/debounce'
export default {
    data() {
        return {
            visible: false,
            getByIdURL: '/api/sipAccount/getById',
            addURL: '/api/sipAccount/add',
            updateURL: '/api/sipAccount/update',
            dataForm: {
                username: '',
                password: '',
                remark: '',
            },
            rules: {
                username: [
                    { required: true, message: '必填项不能为空', trigger: 'blur' },
                ],
                password: [
                    { required: true, message: '必填项不能为空', trigger: 'blur' },
                ],
            },
        }
    },
    methods: {
        init(id) {
            this.visible = true;
            this.$nextTick(() => {
                if (id) {
                    this.dataForm.id = id
                    this.getInfo()
                }
            })
        },
        getInfo() {
            this.$http.get(this.getByIdURL + `?id=${this.dataForm.id}`).then(({ data: res }) => {
                if (res.code !== 0) {
                    this.$message.error(res.msg);
                    return
                }
                this.dataForm = res.data
            }).catch(() => { })
        },
        async handleSubmit() {
            var errors = await this.$refs.formRef.validate();
            if (errors === undefined) {
                var url = this.dataForm.id ? this.updateURL : this.addURL;
                this.$http[!this.dataForm.id ? 'post' : 'put'](url, this.dataForm).then(({
                    data: res
                }) => {
                    if (res.code !== 0) {
                        Modal.message({ message: res.msg, status: 'error' })
                        return
                    }
                    this.$refs.formRef.resetFields();
                    this.$emit('refreshDataList')
                    this.dataForm = {}
                    this.visible = false
                    this.$message.success("操作成功");
                }).catch(() => { })
                return true;
            } else {
                return false;
            }
        },
        handleCancle() {
            this.visible = false;
            this.$refs.formRef.resetFields();
            this.dataForm.id = undefined
        },
    }
}
</script>
<style scoped></style>